﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru" lang="ru">
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
	<title>Vertical Accordion Demo Page</title>
	<link rel="stylesheet" type="text/css" href="styles.css" />
	<style type="text/css">
		body{
			font-family: Verdana, Arial, Sans-Serif;
			font-size: 12px;
		}
		.vAccordionTable{
			margin:10px;
		}
	</style>
	<script type="text/javascript" src="lib/jquery-1.9.1.min.js"></script>
	<script type="text/javascript" src="../html/html.js"></script>
	<script type="text/javascript" src="vaccordion.js"></script>
	<script type="text/javascript">
		$(function(){
			$("#demo1").vAccordion([70, [80,150], [50, 110], [80, 200]]);
			$("#demo2").vAccordion([120, [80,250], 40, 50, 70]);
		});
	</script>
</head>
<body>
	<h1>Vertical Accordion Demo Page</h1>
	
	
	<table id="demo1" border="1" cellpadding="3" cellspacing="0">
		<tr>
			<th>Ф.И.О.</th>
			<th>Должность</th>
			<th>Телефон</th>
			<th>Адрес</th>
		</tr>
		<tr>
			<td>Иванов И.И.</td>
			<td>Генеральный директор</td>
			<td>444-4444</td>
			<td>Москва, 1й-Силикатный проезд, 11</td>
		</tr>
		<tr>
			<td>Петров П.П.</td>
			<td>Начальник отдела</td>
			<td>333-3333</td>
			<td>Москва, 2й-Силикатный проезд, 22</td>
		</tr>
		<tr>
			<td>Сидоров С.С.</td>
			<td>Ведущий специалист</td>
			<td>444-4445</td>
			<td>Москва, 1й-Силикатный проезд, 11</td>
		</tr>
		<tr>
			<td>Иваненко И.И.</td>
			<td>водитель</td>
			<td>8(915)312-4433</td>
			<td>Москва, 1й-Силикатный проезд, 11</td>
		</tr>
	</table>
	
	<br/>
	
	<table id="demo2" border="1" cellpadding="3" cellspacing="0">
		<tr>
			<th>Наименование</th>
			<th>Назначение</th>
			<th>Высота</th>
			<th>Ширина</th>
			<th>Цена</th>
		</tr>
		<tr>
			<td rowspan="4">Блок бетонный</td>
			<td rowspan="4">Блок бетонный предназначен для строительства зданий и сооружений промышленного назначения, жилья, детских садов, спортивных сооружений, объектов дорожного строительства.</td>
			<td rowspan="2">200</td>
			<td>120</td>
			<td>500</td>
		</tr>
		<tr>
			<td>180</td>
			<td>600</td>
		</tr>
		<tr>
			<td rowspan="2">400</td>
			<td>180</td>
			<td>1200</td>
		</tr>
		<tr>
			<td>210</td>
			<td>1500</td>
		</tr>
		<tr>
			<td rowspan="4">Мост чугунный</td>
			<td rowspan="4">Мост чугунный предназначен для производства, возведения, модернизации, эвакуации, изоляции, и декларации.</td>
			<td rowspan="2">2200</td>
			<td>1120</td>
			<td>50000</td>
		</tr>
		<tr>
			<td>1180</td>
			<td>60000</td>
		</tr>
		<tr>
			<td rowspan="2">3400</td>
			<td>1180</td>
			<td>120000</td>
		</tr>
		<tr>
			<td>1210</td>
			<td>150000</td>
		</tr>
		
		
	</table>
</body>
</html>